import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

import { viteMockServe } from "vite-plugin-mock";
import viteSvgIcons from 'vite-plugin-svg-icons';

import path from "path";

// 无法直接使用环境变量 https://www.jianshu.com/p/4973bd983e96
// var useMock = import.meta.env.DEV // 获取不到
// 解决方法：
// 导入 loadEnv ，可以使用 loadEnv(mode, process.cwd()).VITE_MOCK 获取环境变量
import { loadEnv } from 'vite'

// https://vitejs.dev/config/
// command 运行命令， mode 模式
export default defineConfig(({command, mode}) => {
  return {
    base:'./', // 开发或生产环境服务的公共基础路径
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src")
      }
    },
    plugins: [
      vue(),
      // mock配置
      viteMockServe({
        mockPath:'mock',// 设置模拟.ts 文件的存储文件夹，默认为根目录下的mock文件夹
        supportTs: false, //打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件。
        localEnabled: true, // 设置是否启用本地 xxx.ts 文件，不要在生产环境中打开它.设置为 false 将禁用 mock 功能
        prodEnabled: loadEnv(mode, process.cwd()).VITE_MOCK == 'true', // 设置打包是否启用 mock 功能
        //  这样可以控制关闭mock的时候不让mock打包到最终代码内
        injectCode: `
          import { setupProdMockServer } from '../mockProdServer';
          setupProdMockServer();
        `,
      }),
      viteSvgIcons({
        // 指定需要缓存的图标文件夹
        iconDirs: [path.resolve(process.cwd(), 'src/icons')],
        // 指定symbolId格式
        symbolId: 'icon-[dir]-[name]',
      }),
    ],
    // css: {
    //   //css预处理
    //   preprocessorOptions: {
    //     scss: {
    //       /*
    //       引入var.scss全局预定义变量，
    //       如果引入多个文件，
    //       可以使用
    //       '@import "@/assets/scss/globalVariable1.scss";@import "@/assets/scss/globalVariable2.scss";'
    //       这种格式
    //        */
    //       additionalData: '@import "@/style/element/element-style.scss";'
    //     }
    //   }
    // }

}
})
